<!--
 * @Author: Tim
 * @Date: 2020-08-26 16:01:38
 * @LastEditTime: 2020-08-27 15:24:27
 * @LastEditors: Please set LastEditors
 * @Description: form row 包裹
 * @FilePath: /afire/components/af_form_row/index.vue
-->
<template>
    <view class="af-flex-row af-y-start af-form-row af-pt-10 af-pb-10">
        <text class="af-pr-10 af-fs-28 label-txt" :style="getStyl" :class="labelClass"
            v-if="label">{{label + '：'}}</text>
        <view class="af-flex-1">
            <slot></slot>
        </view>
    </view>
</template>

<script>
    /**
     * 默认label为28px【ios6设计稿】
     */
    export default {
        props: {
            label: String,

            labelHeight: {
                type: Number,
                default: 60
            },

            ///label额外的class
            labelClass: String
        },

        data() {
            return {

            }
        },

        computed: {
            getStyl() {
                return `line-height:${this.labelHeight}rpx;`;
            }
        }
    }
</script>

<style lang="scss" scoped>
    .af-form-row {
        position: relative;
        width: 100%;
        box-sizing: border-box;
    }

    .label-txt {
        color: #141414;
        box-sizing: border-box;
        // line-height: 60upx;
    }
</style>